<template>
    <view class="container">
        <view class="phone"></view>
        <view class="tips">当前绑定的手机号码</view>
        <u--text
            :text="phone"
            size="32rpx"
            bold
            mode="phone"
            align="center"
            format="encrypt"
        ></u--text>
        <view class="btn" @click="navigateTo('pages/binding/index', {isRelieve: true})">账号换绑</view>
    </view>
</template>
<script>
export default {
    data() {
        return {
            phone: ''
        }
    },
    onLoad() {
        this.phone = this.$store.getters.mobile
    },
    methods: {
        navigateTo(path, params={}) {
            uni.$u.route({
				url: path,
				params
			})
        }
    }
}
</script>
<style lang="scss" scoped>
    .container {
        padding: 150rpx 50rpx;
        .phone {
            width: 165rpx;
            height: 200rpx;
            background: url(https://img.ionepin.com/62defff56bc5b116982c0360ecfb9bdc7502185a.png) no-repeat;
            background-size: 100% 100%;
            margin: 0 auto;
        }
        .tips {
            font-size: 26rpx;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: #999999;
            margin: 55rpx auto 40rpx auto;
            text-align: center;
        }
        .btn {
            height: 90rpx;
            background: #000000;
            font-size: 30rpx;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: #FFFFFF;
            text-align: center;
            line-height: 90rpx;
            margin-top: 100rpx;
        }
    }
</style>